<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="./index2.css">
</head>
<body>
    <div id="box" v-cloak>
        <div class="nav">
            <div class="logo">
                <img src="https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTcvMDUvYzE4ZDJlMmViMWExOTc4NzNjYTczOGFiNWZmMGRjNzEucG5n.png">
            </div>  
            <div class="navlist">
                <div>产品</div>
                <div>功能</div>
                <div>关于</div>
                <div>团队</div>
            </div>
        </div>
        <!--轮播图 -->
        <div>
            <el-carousel indicator-position="outside">
                <el-carousel-item v-for="(item,$index) in arr" :key="$index">
                  <div class="imgbox" :style="{backgroundImage:'url('+item.imgurl+')',backgroundSize:'100% 100%'}">
                     <div class="tabletext">
                        <div>{{item.text}}</div>
                        <div>{{item.content}}</div>
                     </div>
                  </div>
                </el-carousel-item>
            </el-carousel>
        </div>
        <!--  -->
        <div style="padding-top:100px;">   
            <titlebox title="产品介绍" inco="el-icon-discount" text="亲，本版本是最简单的单页式模板，不需要创建内页一般来说，
            只要半天就可以完成对这个模板的设定哦">
                <div style="padding: 60px 0;">
                    <img src="https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYjU5YzY3YmYxOTZhNDc1ODE5MWU0MmY3NjY3MGNlYmEuanBn.jpg">
                </div>
            </titlebox>
        </div>
        <div style="padding-top: 40px;">
            <titlebox title="模板功能" inco="el-icon-table-lamp" text="这些文字都是可以根据您的需要自行更改的，所以不要怕和您的需要不一样哦.
            图片的话都没有具体的大小要求，合适就好，开心就好">
                <div style="overflow: hidden;margin-left:200px;">
                 
                    <div class="module_list" v-for="i in 6">
                        <div>
                            <div></div>
                            <h3 style="text-align: center;padding-top: 30px;">aaaaaa</h3>
                            <p style="text-align: center;">213124134124</p>
                        </div>
               
                   </div>
                </div>
            </titlebox>
        </div>
        <!--  -->
        <div class="bootme">
            <div class="content_me">
                <titlebox style="color: #fff;margin-top: 200px;" title="关于我们" inco="el-icon-coin" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。">
                    <div style="text-align: center;color: #ff5100;font-size: 18px;">
                        起飞页自主建站平台
                    </div>
                </titlebox>
            </div>
        </div>
        <!--  -->
        <div>
            <div class="td">
                <titlebox style="color:black;padding-top: 25px;" title="我们的团队" inco="el-icon-coin" text="介绍一下您的强大的团队吧。几行热情的自我介绍可以迅速的拉近您和访客的距离。">
                </titlebox>
                <div class="lunbo">
                <div class="xs" :style="{'left':left}">
                        <div v-for="i in lb" style="float: left;">
                            <img :src="i.imgurl" alt="">
                            <h2>{{i.cc}}</h2>
                            <h3>{{i.dd}}</h3>
                            <p>{{i.ee}}</p>
                        
                        </div>
                        
                    </div>
                    <span @click="prev">《</span>
                    <span @click="next">》</span>
                    
                </div>
            </div>
        </div>
        <!--  -->
        <div class="cp">
            <div class="cpbox">
                <titlebox style="color: #fff;" title="产品销售" inco="el-icon-position" text="很少人会做第一个吃螃蟹的人，我们不妨避开让人尴尬的数据而展示一些客户愿意看的漂亮数据">
                    <div style="text-align: center;color: #ff5100;font-size: 18px;margin-bottom: 30px;">
                        起飞页自主建站平台
                    </div>
                </titlebox>
                    <ul class="quan">
                        <li>
                            <div>66</div>
                            <h3>发布版本</h3>
                            <img src="https://f.goodq.top/qfy-content/plugins/revslider/rs-plugin/assets/loader.gif" alt="">
                        </li>
                        <li>
                            <div>66</div>
                            <h3>发布版本</h3>
                            <img src="https://f.goodq.top/qfy-content/plugins/revslider/rs-plugin/assets/loader.gif" alt="">
                        </li>
                        <li>
                            <div>66</div>
                            <h3>发布版本</h3>
                            <img src="https://f.goodq.top/qfy-content/plugins/revslider/rs-plugin/assets/loader.gif" alt="">
                        </li>
                        <li>
                            <div>66</div>
                            <h3>发布版本</h3>
                            <img src="https://f.goodq.top/qfy-content/plugins/revslider/rs-plugin/assets/loader.gif" alt="">
                        </li>
                    </ul>
            </div>
        
        <!--  -->
        
            <div class="zs">
                <titlebox style="color:black;padding-top: 25px;" title="产品展示" inco="el-icon-coin" text="一个没打过仗的军队很难有说服力，当然打了很多败仗的故事也不会增加任何说服力。所以说说您成功的项目经验吧，如果没有，也可以有哦。">
                </titlebox>
                <div class="zsbox">
                    <div class="zs_title">
                        <div v-for="(i, index) in zs" @click="num1 = index">{{i.tittle}}</div>
                    </div>

                    <div>
                        <div v-for="i2, index2 in zs"  v-show="num1 == index2">
                            <div v-for="i3 in i2.arr_img" class="zs_img"><img class="img22" :src="i3" alt=""></div>
                        </div>
                    </div>
                </div>   
            </div>
        
       
        <!-- </div> -->
        <div class="cp">
            <div class="cpbox">
                <titlebox style="color: #fff;" title="产品价格" inco="el-icon-position" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务">
                </titlebox>
              <div class="jgmaxbox" style="margin:auto;">
                <jgbox tittle="基础版"  jg="99"></jgbox>
                <jgbox class="active" tittle="高级版"  jg="159"></jgbox>
                <jgbox tittle="终极版"  jg="299"></jgbox>
              </div>
            </div>
        </div>
        <!--  -->
        <div class="fw">
            <div class="fwbox">
                <titlebox style="color:black;" title="产品价格" inco="el-icon-position" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务
                 ">
                </titlebox>
              <jsbox icon="el-icon-s-grid">

              </jsbox>
              <jsbox icon="el-icon-add-location">

            </jsbox>
            <jsbox icon="el-icon-delete-location">

            </jsbox>
            <jsbox icon="el-icon-cold-drink">

            </jsbox>
            </div>
        </div>
        <!--  -->
        <div class="pj" style="background-image: url(https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvOTkyZTYzMDgwZWUxZTQ3Yjk5ZjQyYjhkNjRlZGU5NTMuanBn.jpg);">
            <div class="pjbox">
                <titlebox style="color: #fff;" title="客户评价" inco="el-icon-grape" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。">
                   
                </titlebox>
                <div></div>
                <div class="lunbo"style="width: 934px;height: 204px;">
                    <div class="xs" :style="{'left':l}" class="dailibox">
                            <div v-for="i in pj" style="float: left;width: 865px;">
                                <img :src="i.imgurl" alt="" style="float: left;width: 130px;height: 130px;margin-left: 40px;border-radius: 50%;">
                                <div style="float: left; text-align: center;width: 685px;height: 45px;">
                                    <p style="color: #fff;">{{i.p}}</p>
                                    <h3 style="color: #fff;">{{i.daili}}</h3>
                                </div>
                                
                            
                            </div>
                            
                        </div>
                        <span @click="p" style="color: #fff;">《</span>
                        <span @click="n">》</span>
                        
                    </div>
            </div>
        </div>
        <!--  -->
        <div class="footer">
            <div class="fleft">
               <div style="margin:100px auto;width: 600px;" >
                <titlebox style="color:black;" title="联系我们" inco="el-icon-folder-checked" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。">
                    <input type="text" placeholder="姓名" class="input">
                    <input type="text"value="邮箱(必填)" placeholder="邮箱" class="input">
                    <input type="text" placeholder="留言" class="input1">
                    <div class="fasong">发送</div>
                   
                </titlebox>
               </div>
            </div>
            <div class="fright" style="background-image: url(https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvZDVlZTJlZWRmY2Y3YWRjMjg1ZGI0OTY3YmQ4NjkxMGQtNTAweDMwMC5qcGc_p_p100_p_3D.jpg);">
                <div class="pjbox">
                    <div style="margin:50px auto;width: 600px;">
                        <titlebox style="color:#fff; "title="关于我们" inco="el-icon-sunny" text="起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。">
                           
                        </titlebox>
                       
                       </div>
                </div>
               
            </div>
        </div>
    </div>
</body>
<script src="./vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="./index2.js"></script>
<script>
    new Vue({
        el:"#box",
        
        data:{
            num1:0,
            arr:[
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTgvMTAvMDNkYTM3MTQ2YjA1YzM5MTM1YWFjYWE4YTdlZDNkZDguanBn.jpg',
                    text:'做一个精彩的站点',
                    content:'为情怀而干杯，告别朴素的重复和一望无际的平庸'
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvNzliN2NkY2QxNGRiMTRlOWNiNDk4ZjE3OTM4MTdkNjkuanBn.jpg',
                    text:'我在灯火阑珊处',
                    content:'起飞页是放飞梦想的地方，也是寻梦的地方'
                }
            ],
            lb:[
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYmU3YTcyNzAzZjVjZDZjYzc3MmQ0N2E1Y2QyZGJjOTctNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                     ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYTI2NzI2YzFlMDJhM2ZiNjRlNWM0MmM0MzEwZWFlMzktNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYTNkNDA0Mjg2MmVkNjE3Mzk0M2QwOTQ4M2M5NjM3NGMtNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvZmYxNDZkZjNiODBkMmE0M2FmNTZhYzY3Nzk3YWEwZDUtNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYmU3YTcyNzAzZjVjZDZjYzc3MmQ0N2E1Y2QyZGJjOTctNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYTI2NzI2YzFlMDJhM2ZiNjRlNWM0MmM0MzEwZWFlMzktNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvYTNkNDA0Mjg2MmVkNjE3Mzk0M2QwOTQ4M2M5NjM3NGMtNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvZmYxNDZkZjNiODBkMmE0M2FmNTZhYzY3Nzk3YWEwZDUtNDAweDQwMC5qcGc_p_p100_p_3D.jpg',
                    cc:'彭少宏',
                    dd:'CEO总经理',
                    ee:'您可以双击这里或者点击编辑按钮来修改内容，您可以添加按钮图片等常用元素。您可以双击这里或者点击编辑按钮来修改内容。',
                },
               
            ],
            zs:[
                {
                    tittle:'活动策划|',
                    arr_img:[
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    ]
                 },
                 {
                    tittle:'画册设计|',
                    arr_img:[
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMzc5MDE2MTk1MDExZGQ3NzkxZGNmZjY3OTZkNDg2YzktNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    ]
                 },
                 {
                    tittle:'电影宣传片制作|',
                    arr_img:[
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMzc5MDE2MTk1MDExZGQ3NzkxZGNmZjY3OTZkNDg2YzktNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTQvMDYvMWJhY2VjZjE5ZmNhOGIwNDllZTU1OGY1ZDFkYmVhNTEtNTAweDMwMC5qcGc_p_p100_p_3D.jpg',
                    ]
                 },
            ],
            pj:[
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTYvMDcvOGY3OTQwZDBlZDFlYjM3NDIwNmMwMWEzMjA3ODY0MGItMTUweDE1MC5qcGc_p_p100_p_3D.jpg',
                    p:'起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。',
                    daili:'—— 西安某英语培训机构, 代理',
                },
                {
                    imgurl:'https://ccdn.goodq.top/caches/4a7b7daf436f3e5cb2e29433375ccd5d/aHR0cHM6Ly81NTlhNDQ3YzczMmVlLnQ3My5xaWZlaXllLmNvbS9xZnktY29udGVudC91cGxvYWRzLzIwMTYvMDcvOGY3OTQwZDBlZDFlYjM3NDIwNmMwMWEzMjA3ODY0MGItMTUweDE1MC5qcGc_p_p100_p_3D.jpg',
                    p:'起飞页不仅是一个方便快捷的构建网站的自助建站平台，更重要的是，我们为中国用户提供了更多贴心的服务：网站备案、自动备份、快速恢复以及网站代建服务。我们使用了国内和香港最好的网络和云服务器，确保您的网站能够快速完美的呈现在访客面前。',
                    daili:'—— 西安某英语培训机构, 代理',
                },
            
             
            ],
            num:0,
            left:20 + 'px',
            shu:0,
            l:20+'px'
        },
        methods: {
            prev(){
                this.num--
                if(this.num<0){
                   this.num=1
                }
                this.left = (this.num * -1189) +20 + 'px'
            },
            next(){
                this.num++
                if (this.num>1) {
                    this.num=0
                }
                this.left = (this.num * -1189) +20 + 'px'
            },
            btn22(){
                console.log(22)
            },
            p(){
                this.shu--
                if(this.shu<0){
                   this.shu=1
                }
                this.l = (this.shu * -880) +20 + 'px'
            },
            n(){
                this.shu++
                if (this.shu>1) {
                    this.shu=0
                }
                this.l = (this.shu * -880) +20 + 'px'
            },
        },
        
        
    })
</script>
</html>